<!DOCTYPE html>
<html>
	<head>
		<meta charset="{CHARSET}">
		<title></title>
	</head>
	<body>
		<canvas id="canvas"></canvas>
	</body>
	<script type="text/javascript">
		canvas = document.getElementById("canvas");
		context = canvas.getContext("2d");
		
		window.addEventListener("load",function(){
			var imgData = context.createImageData(canvas.width,canvas.height);
			var data = imgData.data;
			for (var i = 0;i < canvas.width*4*100; i+=4) {
				data[i] = 255;
				data[i + 3] = 255;
			}
			for (var i = canvas.width*4*100;i < canvas.width*4*400;i+=4) {
				data[i + 1] = 255;
				data[i + 3] = 255;
			}
			
			context.putImageData(imgData,0,0);
		},true);
	</script>
</html>
